<template>
	<view class="wrap">
		<u-form class="u-m-b-20" :model="hog" :rules="rules" ref="uForm" :errorType="errorType">
			<u-form-item label-width="140" label-position="left" label="所属畜舍" prop="houseName">
				<u-input type="select" :select-open="showHouses" v-model="hog.houseName" placeholder="请选择所属畜舍" @click="showHouses = true"></u-input>
			</u-form-item>
			<u-form-item label-width="140" label-position="left" label="所属畜栏" prop="coteName">
				<u-input type="select" :select-open="showCotes" v-model="hog.coteName" placeholder="请选择所属畜栏" @click="showCotes = true"></u-input>
			</u-form-item>
			<u-form-item label-width="140" label-position="left" label="牲畜种类" prop="type">
				<u-radio-group v-model="hog.type">
					<u-radio v-for="(item, index) in types" :key="index" :name="item.id">
						{{ item.name }}
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item label-width="140" label-position="left" label="牲畜性别" prop="sex">
				<u-radio-group v-model="hog.sex">
					<u-radio v-for="(item, index) in sexs" :key="index" :name="item.id">
						{{ item.name }}
					</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item label-width="140" label-position="left" label="ICCID" prop="iccid">
				<u-input placeholder="请输入ICCID或扫描二维码" v-model="hog.iccid" type="text"></u-input>
				<u-icon class="u-p-l-20" name="scan" size="44" @click="scan()"></u-icon>
			</u-form-item>
			<u-form-item label-width="140" label-position="left" label="出生日期" prop="birthday">
				<u-picker v-model="showDate" mode="time" @confirm="setBirthday"></u-picker>
				<u-input placeholder="请选择出生日期" v-model="hog.birthday" type="select" :select-open="showDate" @click="showDate = true"></u-input>
			</u-form-item>
			<u-form-item label-width="140" label-position="left" label="上传间隔">
				<u-number-box v-model="hog.timeUpload"></u-number-box>
			</u-form-item>
			<u-form-item label-width="140" label-position="left" label="报警上限" prop="warnLimit">
				<u-input placeholder="请输入报警上限" v-model="hog.warnLimit" type="number"></u-input>
			</u-form-item>
		</u-form>
		<u-button type="primary" @click="submit">保存</u-button>
		<u-action-sheet :list="houses" v-model="showHouses" @click="setHouse"></u-action-sheet>
		<u-action-sheet :list="cotes" v-model="showCotes" @click="setCote"></u-action-sheet>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				hog: {
					iccid:'',
					timeUpload: 1,
					warnLimit: 42.3
				},
				houses: [],
				cotes: [],
				sexs: [],
				types: [],
				errorType: ['message'],
				showHouses: false,
				showCotes: false,
				showDate: false,
				rules: {
					houseName: [{
						required: true,
						message: '请选择所属畜舍',
						trigger: 'change'
					}],
					coteName: [{
						required: true,
						message: '请选择所属畜栏',
						trigger: 'change'
					}],
					type: [{
						required: true,
						message: '请选择牲畜种类',
						trigger: 'change'
					}],
					sex: [{
						required: true,
						message: '请选择牲畜性别',
						trigger: 'change'
					}],
					iccid: [{
						required: true,
						message: '请输入ICCID或扫描二维码',
						trigger: ['change', 'blur']
					}, {
						pattern: /^(\d{19})([0-9]|[a-zA-Z])$/,
						message: 'ICCID格式不正确',
						trigger: ['change', 'blur']
					}],
					birthday: [{
						required: true,
						message: '请选择出生日期',
						trigger: 'change'
					}]
				}
			};
		},
		onLoad() {
			this.loadSexs()
			this.loadTypes()
			this.loadHouses()
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		methods: {
			loadSexs: function() {
				this.$u.api.getDictData('hog_sex').then(res => {
					this.sexs = res.data
				})
			},
			loadTypes: function() {
				this.$u.api.getDictData('hog_type').then(res => {
					this.types = res.data
				})
			},
			loadHouses: function() {
				this.$u.api.getHouses().then(res => {
					var houses = []
					res.data.forEach(e => {
						houses.push({
							text: e.houseName,
							value: e.id
						});
					})
					this.houses = houses
				})
			},
			loadCotes: function(houseId) {
				this.$u.api.getCotes(houseId).then(res => {
					var cotes = []
					res.data.forEach(e => {
						cotes.push({
							text: e.coteName,
							value: e.id
						});
					})
					this.cotes = cotes
				})
			},
			scan: function() {
				uni.scanCode({
					success: res => {
						this.hog.iccid = res.result
					}
				})
			},
			setHouse: function(index) {
				this.hog.houseName = this.houses[index].text;
				this.hog.houseId = this.houses[index].value;
				this.loadCotes(this.houses[index].value)
			},
			setCote: function(index) {
				this.hog.coteName = this.cotes[index].text;
				this.hog.coteId = this.cotes[index].value;
			},
			setBirthday: function(e) {
				this.hog.birthday = e.year + '-' + e.month + '-' + e.day
			},
			submit: function() {
				this.$refs.uForm.validate(valid => {
					if (valid) {
						uni.showLoading()
						this.$u.api.addHog(this.hog).then(res => {
							this.$dm.showSuccess()
							setTimeout(() => {
								uni.navigateBack()
							}, 1500)
						})
					}
				});
			}
		}
	};
</script>

<style lang="scss" scoped>
	.wrap {
		padding: 30rpx;
	}
</style>
